
function loadImage(src) {
  return new Promise((resolve, reject) => {
    let img = new Image();
  // 在线图片设置crossOrigin跨域
    if (src.indexOf(src) === 0) {
      img.crossOrigin = 'anonymous';
    }
    img.setAttribute('crossOrigin', 'anonymous')
        img.src = src;
        img.onload = () => {
          resolve(img)
        };
        img.onerror = () => {
          reject(new Error('图片解析失败'))
        }
      })
    }

  export async function drawWaterMark(src,{text, size, font, fontColor, transparent}, activeSeat) {
    const cvs = document.createElement('canvas');
    cvs.width = 450;
    cvs.height = 450;

    const ctx = cvs.getContext('2d');
    ctx.fillRect(0,0,450,450)
    ctx.clearRect(0,0,450,450)
    const img = await loadImage(src)

    ctx.drawImage(img,0,0);



    let fontStyle =`${size}px ${font}`
    // 文字样式

    ctx.textBaseline = 'middle';
    ctx.font = fontStyle
    ctx.fillStyle = fontColor;
    ctx.globalAlpha = transparent/100

    // 绘制文字
    switch (activeSeat) {
      case 'top_left':
        ctx.textAlign = 'left';
        ctx.fillText(text, 10, 20);
        break;
      case 'top_center':
        ctx.textAlign = 'center';
        ctx.fillText(text, 225, 20);
        break;
      case 'top_right':
        ctx.textAlign = 'right';
        ctx.fillText(text, 440, 20);
        break;
      case 'left_center':
        ctx.textAlign = 'left';
        ctx.fillText(text, 10, 225);
        break;
      case 'center':
        ctx.textAlign = 'center';
        ctx.fillText(text, 225, 225);
        break;
      case 'right_center':
        ctx.textAlign = 'right';
        ctx.fillText(text, 440, 225);
        break;
      case 'bottom_left':
        ctx.textAlign = 'left';
        ctx.fillText(text, 10, 430);
        break;
      case 'bottom_center':
        ctx.textAlign = 'center';
        ctx.fillText(text, 225, 430);
        break;
      case 'bottom_right':
        ctx.textAlign = 'right';
        ctx.fillText(text, 440, 430);
        break;
    }

    // 生成base64图片编码
    const base64Url = cvs.toDataURL();
    return base64Url
  }


export async function drawImgWaterMark(src,{text, size, font, fontColor, transparent}, activeSeat) {
  const cvs = document.createElement('canvas');
  cvs.width = 450;
  cvs.height = 450;

  const ctx = cvs.getContext('2d');
  ctx.fillRect(0,0,450,450)
  ctx.clearRect(0,0,450,450)
  const img = await loadImage(src)

  ctx.drawImage(img,0,0);



  let fontStyle =`${size}px ${font}`
  // 文字样式

  ctx.textBaseline = 'middle';
  ctx.font = fontStyle
  ctx.fillStyle = fontColor;
  ctx.globalAlpha = transparent/100

  const logo = await loadImage('http://zhilubt.oss-cn-hangzhou.aliyuncs.com/ERPSAAS/%E6%B5%99%E6%B1%9F%E7%9B%B4%E8%B7%AF%E7%BD%91%E7%BB%9C%E7%A7%91%E6%8A%80/Test/imges/2020/01/13/big/88653/bizhi%20%282%29.jpg?Expires=1894247007&OSSAccessKeyId=LTAIW5fr3DK5Ij9f&Signature=FU9rrS5hsvHSlYSj6TOR%2B%2Bf4mII%3D')

  let logoWidth = logo.width;
  let logoHeight = logo.height;

  const imgWidth = 450;
  const imgHeight = 450;

  if(logoWidth > imgWidth || logoHeight > imgHeight) {
    const base64Url = cvs.toDataURL();
    return base64Url
  } else {
    switch (activeSeat) {
      case 'top_left':
        ctx.drawImage(logo, 10, 20);
        break;
      case 'top_center':
        ctx.drawImage(logo, (450 - logoWidth) / 2, 20);
        break;
      case 'top_right':
        ctx.drawImage(logo, 450 - logoWidth - 10, 20);
        break;
      case 'left_center':
        ctx.drawImage(logo, 10, (450 - logoHeight) / 2);
        break;
      case 'center':
        ctx.drawImage(logo, (450 - logoWidth) / 2, (450 - logoHeight) / 2);
        break;
      case 'right_center':
        ctx.drawImage(logo, 450 - logoWidth - 10, (450 - logoHeight) / 2);
        break;
      case 'bottom_left':
        ctx.drawImage(logo, 10, 450 - logoHeight - 20);
        break;
      case 'bottom_center':
        ctx.drawImage(logo, (450 - logoWidth) / 2, 450 - logoHeight - 20);
        break;
      case 'bottom_right':
        ctx.drawImage(logo, 450 - logoWidth - 10, 450 - logoHeight - 20);
        break;
    }
    // 生成base64图片编码
    const base64Url = cvs.toDataURL();
    return base64Url

  }
}
